
<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
  <title>台风信息</title>
  <meta name="keywords" content="天气预报,天气,天气预报,中国天气,气象, 气候, 中央气象台, 中国气象局" />
  <meta name="description" content="中国天气网 - 中国最好的天气网站，提供国际国内3000个以上城市的精准天气预报及其它资讯服务。" />
  <script type="text/javascript" language="JavaScript" src="https://i.tq121.com.cn/j/core.js"></script>
  <script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=jhSkY8yP75ZPCoP5RQrixMwBkZDpDWz6"></script>
  <!--[if lte IE 9]><script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=jhSkY8yP75ZPCoP5RQrixMwBkZDpDWz6"></script><![endif]-->
  <script type="text/javascript" src="https://api.map.baidu.com/library/DistanceTool/1.2/src/DistanceTool_min.js"></script>
  <script type="text/javascript" src="https://i.tq121.com.cn/j/typhoon/AreaRestriction_min.js"></script>
  <link rel="stylesheet" href="https://i.tq121.com.cn/c/core.css">
  <link rel="stylesheet" href="https://i.tq121.com.cn/c/typhoon/pcstyle.css">
  <!-- wind -->
  <link rel="stylesheet" href="https://i.tq121.com.cn/c/typhoon/index.css"/>
  <script type="text/javascript" src="https://i.tq121.com.cn/j/typhoon/bd_canvas.js"></script>
  <script type="text/javascript" src="https://j.i8tq.com/typhoon/weatherwind.js?2018"></script>
</head>

<body>
  <center>
    <div class="content" style="width:100%;height:100%;">
        <div id="map" class="map" style="width:100%;padding:0;margin:0;"></div>
        <a class="fullDiv mapImgs full dis" href=""></a>
        <div class="moonDiv mapImgs moon"></div>
        <div class="legend" id="legendBtn">
          <div class="showLegendBtn"><i class="allPcImg leftDown"></i></div>
        </div>
        <div class="forecastDiv dis" id="weatherLive" onMouseDown="drag(this,event)">
            <a class="closePop" href="javascript:;">×</a>
            <div class="ybDiv">
              <a id="pCityName" target="_blank">广州</a>
              <div class="dnInfo">
                <div class="dayInfo">
                  <span>白天</span><br>
                  <big class="png40 d1" id="dayIcon"></big>
                  <h3 id="dayInfoW">24°</h3>
                </div>
                <div class="nightInfo">
                  <span>夜间</span><br>
                  <big class="png40 n1" id="nightIcon"></big>
                  <h3 id="nightInfoW">17°</h3>
                </div>
              </div>
              <div id="weather">中雨转暴雨</div>
              <div id="wind">微风</div>
            </div>
            <div class="nowDiv">
              <div class="newNowTime">最新实况(<span id="newNowTime">09:00</span>)</div>
              <span class="newTemp" id="newTemp">21</span><span style="font-size:16px;">℃</span>
              <div class="newWindImg">
                <i class="windFXBg E" id="newWindFX"></i>
                <span class="windLevel" id="windLevel">5级</span>
              </div>
              <div class="windHumidity">
                <span class="windFX" id="windFX">西风</span>
                <i class="allPcImg iconSD"></i>
                <span class="dataSD" id="dataSD">87%</span>
              </div>
            </div>
        </div>
        <div class="legend dis" id="legendContent">
          <div class="showLegend">
            <img src="https://i.tq121.com.cn/i/typhoon/pcTyphoonLegend.png" id="legend">
            <div class="hideLegendBtn"><i class="allPcImg rightDown"></i>图例</div>
          </div>
        </div>
        <div class="brlogo">
          <i class="allPcImg brlogoP"></i>
        </div>
        <div class="typhoonMsg dis">纬度：14.78123 经度：108.61222</div>
        <div id="singleT" class="typhoonDistance"></div>
        <div id="moreT" class="typhoonDistance dis" style="overflow:hidden;"><ul></ul></div>
        <div class="btnList">
          <div class="btnLi">台风列表</div>
          <!-- <div class="btnLi">降水预报</div>
             <div class="btnLi">大风预报</div>  -->
          <div class="btnLi">卫星云图</div>
          <div class="btnLi" id="radarAutoClick">雷达图</div>
          <div class="btnLi">测距</div>
          <div class="btnLi">风场</div>
        </div>
        <!-- 降水预报 -->
        <div class="imgInfoDiv dis" id="rainList">
            <!-- <div class="imgInfo">
              <span class="imgInfoLeft">逐小时降水预报</span>
              <span class="imgInfoRight">2016年05月10日08时发布</span>
            </div> -->
            <div class="radarContent">
              <div class="radarStatus">
                <div class="imgInfo">
                  <span class="imgInfoLeft">逐小时降水预报</span>
                  <span class="imgInfoRight" id="rainTime"></span>
                </div>
                <div class="playDiv">
                  <div class="playLi playLi24" id="rainPlay">
                      <a class="active"></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                  </div>
                </div>
              </div>
              <div class="radarPlay">
                  <i class="playBtn" id="rainPlayBtn"></i>
                  <i class="pauseBtn dis" id="rainStopBtn"></i>
              </div>
            </div>
        </div>
        <!-- 大风预报 -->
        <div class="imgInfoDiv dis" id="windList">
            <!-- <div class="imgInfo">
              <span class="imgInfoLeft">逐小时大风预报</span>
              <span class="imgInfoRight">2016年05月10日08时发布</span>
            </div> -->
            <div class="radarContent">
              <div class="radarStatus">
                <div class="imgInfo">
                  <span class="imgInfoLeft">逐小时大风预报</span>
                  <span class="imgInfoRight" id="windTime"></span>
                </div>
                <div class="playDiv">
                  <div class="playLi playLi24" id="windPlay">
                      <a class="active"></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                  </div>
                </div>
              </div>
              <div class="radarPlay">
                  <i class="playBtn" id="windPlayBtn"></i>
                  <i class="pauseBtn dis" id="windStopBtn"></i>
              </div>
            </div>
        </div>
        <!-- 雷达图 -->
        <div class="imgInfoDiv dis" id="radarList">
          <!-- 单站功能暂时不要 -->
            <!-- <div class="radarNav">
              <div class="radarNavLi active" id="nationalRadar">全国雷达</div>
              <div class="radarNavLi" id="sRadar">单站雷达</div>
            </div> -->
            <div class="radarContent" id="allRadar">
              <div class="radarStatus">
                <div class="imgInfo">
                  <span class="imgInfoLeft">全国雷达拼图</span>
                  <span class="imgInfoRight" id="radarTime"></span>
                </div>
                <div class="playDiv">
                  <div class="playLi" id="radarPlay">
                      <a class="active"></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                  </div>
                </div>
              </div>
              <div class="radarPlay">
                  <i class="playBtn" id="radarPlayBtn"></i>
                  <i class="pauseBtn dis" id="radarStopBtn"></i>
              </div>
            </div>

            <div class="radarContent dis" id="singleRadar">
              <div class="radarStatus">
                <div class="imgInfo">
                  <span class="imgInfoLeft" id="sRadarName"></span>
                  <span class="imgInfoRight" id="sRadarTime"></span>
                </div>
                <div class="playDiv">
                  <div class="playLi" id="sRadarPlay">
                      <a class="active"></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                  </div>
                </div>
              </div>
              <div class="radarPlay">
                  <i class="playBtn" id="sRadarPlayBtn"></i>
                  <i class="pauseBtn dis" id="sRadarStopBtn"></i>
              </div>
            </div>
        </div>
        <!-- 卫星云图 -->
        <div class="imgInfoDiv dis" id="cloudList">
            <div class="radarContent">
              <div class="radarStatus">
                <div class="imgInfo">
                  <span class="imgInfoLeft">卫星云图</span>
                  <span class="imgInfoRight" id="cloudTime">2016年05月10日 08:00</span>
                </div>
                <div class="playDiv">
                  <div class="playLi" id="cloudPlay">
                      <a class="active"></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                      <a></a>
                  </div>
                </div>
              </div>
              <div class="radarPlay">
                  <i class="playBtn" id="cloudPlayBtn"></i>
                  <i class="pauseBtn dis" id="cloudStopBtn"></i>
              </div>
            </div>
        </div>

        <div class="typhoonInfoList">
            <div class="typhoonInfoTitle">
              <span class="activeTyphoon typhoonInfo"></span>
              <span class="activeTyphoon"></span>
              <span class="activeTyphoon"></span>
              <span class="activeTyphoon"></span>
              <span class="typhoonInfoPlay dis"></span>
              <span class="more"><img src="https://i.tq121.com.cn/i/typhoon/arrow01.png" id="moreImg"></span>
            </div>
            <div id="typhoonPointList" class="dis">
              <div class="typhoonPointList">
                  <div class="tableTitle">
                    <span class="time">过去时间</span>
                    <span class="lnglat">经纬度</span>
                    <span>气压<br>(hPa)</span>
                    <span>风速<br>(m/s)</span>
                  </div>
                  <div class="tableList">
                  </div>
              </div>
              <div class="typhoonInfoBottom">
                <span class="playInfo">播放速度</span>
                <div class="playSpeed">
                  <div class="cursor"><i class="handle" id="handle"></i></div>
                  <div class="rod"></div>
                </div>
                <span class="playButton">播放</span>
              </div>
            </div>
        </div>
        <div class="typhoonList dis">
          <div class="typhoonListTitle">
            <div class="title">台风列表</div>
            <div class="year">
              <div class="area">
                  <ul class="clearfix">
                      <li class="return_reques">
                          <input type="text" name="" value="年份选择" id="selectYear" class="local select_style provin_select" onfocus="this.blur()">
                          <div class="clearfix pa">
                              <div class="bomb_con_style provin_con none">
                                 <dl class="selectYear">
                                 </dl>
                              </div>
                          </div>
                      </li>
                  </ul>
              </div><!--area ed-->
            </div>
            <div class="clearAll"><i class="mapImgs "></i>清空</div>
            <div class="close">×</div>
          </div>
          <div class="typhoonListContent" id="typhoonList">
          </div>
        </div>
    </div>
  </center>


<script>
W.use('j/typhoon/pcIndex');
</script>
<script type="text/javascript" src="https://i.tq121.com.cn/j/typhoon/getScrollOffsets.js"></script>
<script type="text/javascript" src="https://i.tq121.com.cn/j/typhoon/drag.js"></script>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?4e4dd1ea33988742f1e489d55d0b6890";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?2aad11eb4f54116f7c5cf907221c3093";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>

</body>

</html>
